<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- tbu -->
    <header class="header">
        <div class="tt-header">
            <div class="tt-header_left">
                <img src="../images/logo.png" alt="有道云笔记">
            </div>
            <div class="tt-header_right">
                <a href="./index.html" target="_blank">首页</a>|
                <a href="javascript:;"> &nbsp;多平台下载</a>
            </div>
        </div>
    </header>
    <section class="section">
        <!-- 登录方式 -->
        <form class="section_left">
            <div class="row">
                <span class="login-type sectioned" data-type="netease">网易通行证登录</span>
                <span class="login-type-split"></span>
                <span class="login-type" data-type="phone">手机验证码登录</span>
            </div>


            <!-- 点击显示 -->
            <div class="row_show" style="display: block ;">
                <div class="row_container">
                    <div class="row_item">
                        <input type="text" placeholder="账号" class="form_input">
                    </div>
                    <div class="row_item">
                        <input type="password" placeholder="密码" class="form_input">
                    </div>
                    <div class="row_item item3">
                        <label class="login-label" style="font-size:12px;">
                     <input type="checkbox" checked="checked">自动登录
                  </label>
                        <a href="javascript:;" style="font-size:12px">忘记密码?</a>
                    </div>

                </div>

                <div class="row-btn">
                    <button type="submit" class="btn btn_left">登录</button>
                    <a href="#" class="btn btn_right">注册</a>
                </div>

                <div class="row-agia">
                    <input type="checkbox" checked="checked">我已阅读、同意云笔记<a href="">《服务条款》</a><a href="">《隐私政策》</a>
                </div>
            </div>

            <!-- 手机验证码登录 -->
            <div>
                <div class="row_show" style="display: none">
                    <div class="container"></div>
                    <form>
                        <div class="forme">
                            <div class="phone">
                                <span class="num">+86</span>
                                <ul class="num_uls">
                                    <li>中国 <span>+86</span></li>
                                    <li>台湾地区 <span>+886</span></li>
                                    <li>香港地区 <span>+852</span></li>
                                    <li>澳门地区 <span>+853</span></li>
                                    <li>马来西亚 <span>+60</span></li>
                                    <li>新加坡 <span>+65</span></li>
                                </ul>
                                <input type="tel" spellcheck="false" tabindex="1" autocomplete="off" class="dlemail j-nameforslide" name="email" placeholder="请输入手机号" id="phoneipt" maxlength="11">
                            </div>

                            <div class="inner_span"></div>

                            <div class="Verification">
                                <input type="text" name="" id="newCode">
                                <div id="code">
                                </div>
                                <input type="button" name="" id="validate" value="验证">
                            </div>
                            <div class="btn_bttom">
                                <button>登录</button>
                            </div>
                    </form>
                    </div>
                </div>
        </form>
        </div>
        <!-- 中间线 -->
        <div class="section_center"></div>

        <!-- 其他登录 -->
        <div class="section_right">
            <h2>其他账号登录</h2>

            <!-- 四个登录方式 -->
            <ul class="uls_right">
                <li class="uls_right_item">
                    <span class="qq"></span> 使用qq帐号登录
                </li>
                <li class="uls_right_item">
                    <span class="wx"></span> 使用微信帐号登录
                </li>
                <li class="uls_right_item">
                    <span class="wb"></span> 使用新浪微博帐号登录
                </li>
                <li class="uls_right_item">
                    <span class="wy"></span> 使用网易企业邮箱登录
                </li>
            </ul>

            <div class="right_bottom">
                <p class="more">更多登录
                    <span class="more_bottom"></span>
                </p>


                <ul class="tt-uls">
                    <li class="tt-uls-item"></li>
                    <li class="tt-uls-item"></li>
                    <li class="tt-uls-item"></li>
                    <li class="tt-uls-item"></li>
                </ul>
            </div>
        </div>
    </section>

    <footer class="footer">
        <div class="nav">
            <a href="">©2021</a>
            <a href="">| 关于有道</a>
            <a href="">| 有道推广</a>
            <a href="">| 官方博客</a>
            <a href="">| 技术博客</a>
            <a href="">| 诚聘英才</a>
        </div>
    </footer>
</body>

</html>